<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>三大特性</title>
    <style>
        /* 1、继承特性 */
        /* 指元素可以继承上级元素文本和字体相关的样式  */
        div{
            color: red;
        }
        /* 2、层叠特性 */
        /* 多个选择器有可能选择到同一个元素 */
        p{
            color: green;
        }
        /* 3、优先级 作用范围越小 优先级越高 */
        /* 如果添加的样式相同 则有选择器的优先级决定哪个生效 */
        #p1{
            color: blue;
        }
        /* 将样式的优先级提升至最高 */
        p{
            color: orange !important;
        }
    </style>
</head>
<body>
<p id="p1">p1</p>
<div>div
    <p>p2</p>
    <span>span</span>
    <a href="">超链接</a>
</div>
</body>
</html>